<template>
  <div style="width: 300px;height:300px;background-color: #FFF;border-radius: 5px; flex-shrink:0;display: flex;justify-content: space-between;flex-direction:column">
    <div style="padding: 20px;box-sizing: border-box">
      <div style="display: flex;justify-content: space-between">
        <span class="f12c90">总收益额</span>
        <i class="el-icon-info f12c90" ></i>
      </div>
      <div style="padding: 30px 0;border-bottom: 1px solid #e5e5e5">
        <span style="font-size: 20px;color: #303133">￥{{sum}}</span>
      </div>
      <div style="margin: 10px 0;text-align: left">
        <span class="f12c60">日销售额</span>
        <span class="f12c60">￥{{day}}</span>
      </div>
    </div>

    <div style="background-color: #409EFF;line-height: 40px;border-bottom-left-radius:5px;border-bottom-right-radius:5px " @click="stateClick()">
      <span style="font-size: 14px;color: #FFF">{{state}}</span>
    </div>
  </div>
</template>

<script>
    export default {
        name: "MyEchartLeft",
      props:{
        sum:Number,
        day:Number,
        state:String
      },
      methods:{
        stateClick(){
          this.$emit('change')
        }
      }
    }
</script>

<style scoped>
  .f12c90{
    font-size: 12px;color: #909399
  }
  .f12c60{
    font-size: 12px;color: #606266
  }
</style>
